<div class="row" ng-controller="hostInfoController">
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading">
                主机名称：{{host.hostName}}
            </div>
            <div class="panel-body">
                <p>状态：{{host.hostStatus == 1?'正常':'连接断开'}}</p>
                <p>IP：{{host.hostIp}}</p>
                <!--<p>Docker：正常</p>-->
                <!--<p>连接主机：ssh@fasdfdsaaf</p>-->
                <p>操作系统：linux</p>
                <!--<p>集群：默认</p>-->
            </div>
        </div>
    </div>
    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-body">
                <uib-tabset active="activeForm">
                    <uib-tab index="0" heading="容器">
                        <div class="panel panel-default">
                            <div class="panel-body" ng-controller="containerController">
                                <table class="table">
                                    <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>容器名称</th>
                                        <th>创建时间</th>
                                        <th>状态</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-repeat="item in items">
                                        <td ng-bind="item.containerId.substring(0,12)"></td>
                                        <td ng-bind="item.containerName"></td>
                                        <td ng-bind="item.createTime"></td>
                                        <td ng-bind="item.containerStatus"></td>
                                        <td>
                                            <button class="btn btn-success" type="button"
                                                    ng-disabled="item.containerStatus.indexOf('Up') == 0"
                                                    ng-click="start(item.containerId)">
                                                启动
                                            </button>
                                            <button class="btn btn-info" type="button"
                                                    ng-disabled="item.containerStatus.indexOf('Exited') == 0"
                                                    ng-click="stop(item.containerId)">
                                                停止
                                            </button>
                                            <!--
                                            <button class="btn btn-danger" type="button" ng-click="info(item.id)">
                                                删除
                                            </button>-->
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="pull-right">
                                <ul uib-pagination
                                    total-items="total"
                                    items-per-page="page.pageSize"
                                    ng-model="page.pageNo"
                                    max-size="maxSize"
                                    previous-text="上一页"
                                    next-text="下一页"
                                    first-text="首页"
                                    last-text="尾页"
                                    boundary-links="true"
                                    force-ellipses="true"
                                    ng-change="pageChanged()"
                                    class="pagination"/>
                            </div>
                        </div>
                    </uib-tab>
                    <uib-tab index="1" heading="镜像">
                        <div class="panel panel-default">
                            <div class="panel-body" ng-controller="imageController">
                                <table class="table">
                                    <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>镜像</th>
                                        <th>创建时间</th>
                                        <th>大小</th>
                                        <th>操作</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-repeat="item in items">
                                        <td ng-bind="item.imageId.substring(7,19)"></td>
                                        <td ng-bind="item.imageLatest"></td>
                                        <td ng-bind="item.createTime"></td>
                                        <td ng-bind="((item.imageSize / 1024 / 1024) | number : fractionSize) + 'MB'"></td>
                                        <td>
                                            <button class="btn btn-danger" type="button" ng-click="info(item.id)">
                                                删除
                                            </button>
                                        </td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="pull-right">
                                <ul uib-pagination
                                    total-items="total"
                                    items-per-page="page.pageSize"
                                    ng-model="page.pageNo"
                                    max-size="maxSize"
                                    previous-text="上一页"
                                    next-text="下一页"
                                    first-text="首页"
                                    last-text="尾页"
                                    boundary-links="true"
                                    force-ellipses="true"
                                    ng-change="pageChanged()"
                                    class="pagination"/>
                            </div>
                        </div>
                    </uib-tab>
                    <uib-tab index="2" heading="网络">
                        <div class="panel panel-default">
                            <div class="panel-body" ng-controller="networkController">
                                <table class="table">
                                    <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>网络名称</th>
                                        <th>驱动</th>
                                        <th>范围</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    <tr ng-repeat="item in items">
                                        <td ng-bind="item.networkId.substring(0,12)"></td>
                                        <td ng-bind="item.networkName"></td>
                                        <td ng-bind="item.networkDriver"></td>
                                        <td ng-bind="item.networkScope"></td>
                                    </tr>
                                    </tbody>
                                </table>
                            </div>
                            <div class="pull-right">
                                <ul uib-pagination
                                    total-items="total"
                                    items-per-page="page.pageSize"
                                    ng-model="page.pageNo"
                                    max-size="maxSize"
                                    previous-text="上一页"
                                    next-text="下一页"
                                    first-text="首页"
                                    last-text="尾页"
                                    boundary-links="true"
                                    force-ellipses="true"
                                    ng-change="pageChanged()"
                                    class="pagination"/>
                            </div>
                        </div>
                    </uib-tab>
                    <uib-tab index="3" heading="Volume">
                        More Tab Content
                    </uib-tab>
                    <uib-tab index="4" heading="监控" select="activeMe()">
                        <div class="panel panel-default" ng-controller="cpuMonitorController">
                            <div class="panel-heading">CPU使用率</div>
                            <div class="panel-body">
                                <div id="cpu" style="width:100%;height:400px;"></div>
                            </div>
                        </div>
                        <div class="panel panel-default" ng-controller="memMonitorController">
                            <div class="panel-heading">内存使用情况</div>
                            <div class="panel-body">
                                <div id="mem" style="width:100%;height:400px;"></div>
                            </div>
                        </div>
                    </uib-tab>
                    <uib-tab index="5" heading="设置">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <form class="form-horizontal">
                                    <div class="form-group">
                                        <label for="hostName" class="col-sm-2 control-label">主机名称：</label>
                                        <div class="col-sm-5">
                                            <input type="text" class="form-control" id="hostName" placeholder="主机名称">
                                        </div>
                                        <div class="col-sm-3">
                                            <button type="button" class="btn btn-default">保存修改</button>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="monVersion" class="col-sm-2 control-label">监控程序：</label>
                                        <div class="col-sm-5">
                                            <input type="text" class="form-control" id="monVersion"
                                                   value="DaoMonit_v0.1" ng-disabled="true">
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </uib-tab>
                </uib-tabset>
            </div>
        </div>
    </div>
</div>
<script type="text/ng-template" id="modal-confirm">
    <div class="modal-header">
        <h3 class="modal-title" id="modal-title">{{title}}</h3>
    </div>
    <div class="modal-body" id="modal-body">
        {{body}}
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary" type="button" ng-click="ok()">确认</button>
        <button class="btn btn-warning" type="button" ng-click="cancel()">取消</button>
    </div>
</script>